import store from "@/store";
import { charts } from "@/api/charts"

var showData = []
function data(){
    charts().then((response) => {
        console.log("sadsad");
        console.log(response);
        showData = response
    })
    return showData
}

export const pie = {
    tooltip: {
        trigger: "item",
    },
    legend: {
        top: "5%",
        left: "center",
    },
    series: [
        {
            name: "访问来源",
            type: "pie",
            radius: ["40%", "70%"],
            avoidLabelOverlap: false,
            itemStyle: {
                borderRadius: 10,
                borderColor: "#fff",
                borderWidth: 2,
            },
            label: {
                show: false,
                position: "center",
            },
            emphasis: {
                label: {
                    show: true,
                    fontSize: "40",
                    fontWeight: "bold",
                },
            },
            labelLine: {
                show: false,
            },
            data: data()
        },
    ],
};
function getY(){
    var data = showData;
    var y = []
    for (let i = 0; i < data.length; i++) {
        y.push(data[i].value)
    }
    return y
}
function getX(){
    var data = store.state.user.chartsData;
    var x = []
    for (let i = 0; i < data.length; i++) {
        x.push(data[i].name)
    }
    return x
}
export const bar = {
    
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'shadow'
        }
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: [
        {
            type: 'category',
            data: getX(),
            axisTick: {
                alignWithLabel: true
            }
        }
    ],
    yAxis: [
        {
            type: 'value'
        }
    ],
    series: [
        {
            name: 'Direct',
            type: 'bar',
            barWidth: '60%',
            data: getY()
        }
    ]
};